<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>ajax demo</title>
</head>

<body>
    <script>
        (function () {
            var xhr = null;
            if (window.XMLHttpRequest) {
                xhr = new XMLHttpRequest();
            } else {
                xhr = new ActiveXObject("Microsoft.XMLHTTP");
            }
            xhr.onreadystatechange = function () {
                if (xhr.status === 200 && xhr.readyState === 4) {
                    console.log("请求成功")
                } else {
                    console.log("请求失败");
                }
            }
            // 要请求位于另一个域中的资源，使用标准的XHR对象并在open()方法中传入绝对URL即可
            // 不能使用setRequestHeader();
            // 不能发送和接受cookie
            // 调用getAllResponseHeaders()总会返回空字符串
            // 由于无论调用同源请求，还是跨域都是使用同样的接口，因此对于本地资源最好使用相对url，在访问远程资源时使用绝对URL地址
            xhr.open("get", "http://somewhere-else.com/page/", true);
            xhr.send(null);
        })();

        (function () {
            // 实现一个跨浏览器的方案，
            // 检测XHR是否支持CORS的最佳方法就是检查是否存在withCredentials属性
            // 再结合检测XDomainRequest对象是否存在就可以兼顾所有的浏览器
            // withCredentials（是否应该发送凭据的属性 true/false） IE11及其他浏览器都支持
            // XDomainRequest 是IE专有的方法支持CORS
            function createCORSRequest(method,url){
                var xhr=new XMLHttpRequest();
                // IE11及其他浏览器支持
                if("withCredentials" in xhr){
                    xhr.open(method,xhr,true);
                }else if(typeof XDomainRequest !=="undefined"){
                    // IE支持，XDR对象仅支持post、get方法 且只能异步创建
                    xhr=new XDomainRequest();
                    xhr.open(method,url);
                }else{
                    xhr=null;
                }
                return xhr;
            }

            var request=createCORSRequest('get',"http://www.somewhere.com");
            if(request){
                // 用于替代onreadystatechange检测成功
                request.onload=function(){
                    //对request.responseText 进行处理
                };
                 // 用于替代onreadystatechange检测错误
                request.onerror=function(){
                    console.log("error");
                }
                // 最后再发送请求，get参数为null，post为data
                request.send();
            }
        })();
    </script>
</body>

</html>